<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>111</title>
    <style>

        .nav a{
            text-align: center;
        }
        .content{
            width: 100%;
            border-top: 1px solid black;
        }
        .content .row{
            margin: 20px 0px;

        }
        .content>div{
            text-align: center;
        }
        table{
            margin-top: 20px;
            width: 70%;
            /* 只有定义了表格的布局算法为fixed，下面td的定义才能起作用。 */
            table-layout:fixed;
        }
        td{
            padding: 5px;
            /*超出部分隐藏*/
            overflow: hidden;
            /* 强制在同一行内显示所有文本，直到文本结束或者遭遇 br 对象。不换行 */
            word-break: keep-all;
            /* 内容超出宽度时隐藏超出部分的内容 */
            white-space:nowrap;
            /* 当对象内文本溢出时显示省略标记(...) ；需与overflow:hidden;一起使用。*/
            text-overflow:ellipsis
        }
    </style>
</head>
<body>

<div class="body">
    <div class="content container-fluid">
        <div class="row"> 
            <form  th:action="@{/showitems(t_id=${3})}" method="post"  id="search" style="display: inline">
                查询：<input type="text" name="title" id="title" value=""/> <input type="submit" value="查询"/>
            </form>
            <a class="xinzeng" th:href="@{/toadd}"><button type="submit" style="width: 50px;height: 25px">新增</button></a>
            <a th:href="@{/showitems(t_id=${2})}"><button type="submit" style="width: 100px;height: 25px">创建时间排序</button></a>
            <a th:href="@{/showitems(t_id=${1})}"><button type="submit" style="width: 100px;height: 25px">优先级排序</button></a>
            <a th:href="@{/showitems(t_id=${4})}"><button type="submit" style="width: 100px;height: 25px">截止时间排序</button></a>
            <table class="table table-bordered table-sm" align="center">
                <thead>
                <tr>
                    <th style="display: none">序号</th>
                    <th>标题</th>
                    <th>内容</th>
                    <th>优先级</th>
                    <th>创建时间</th>
                    <th>截止时间</th>
                    <th>更新时间</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody class="table_node">
                <tr class="tr_node" th:each="items:${itemList}" th:style="'background-color:'+ ${color}">
                    <td style="display: none" th:text="${items.getId()}"></td>
                    <td th:text="${items.items_title}"></td>
                    <td th:text="${items.items_content}"></td>
                    <td th:text="${items.priority}"></td>
                    <td th:text="${items.create_time}"></td>
                    <td th:text="${items.end_time+'小时后'}"></td>
                    <td th:text="${items.update_time}"></td>
                    <td>
                        <a th:href="@{toupdate(id=${items.id})}"><button type="submit" >更新</button></a>
                        <a th:href="@{todelete(id=${items.id})}"><button type="submit" >删除</button></a>
                    </td>
                </tr>
                <!-- more data -->
                </tbody>
            </table>
        </div>
    </div>
</div>
<script>
    setTimeout(function () {
        location.reload()},5000);
</script>

</body>
</html>